<%@tag pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@attribute name="id"%>
<%@attribute name="label"%>
<%@attribute name="value"%>
<%@attribute name="placeholder"%>
<%@attribute name="labelButton"%>
<%@attribute name="identifier"%>
<c:if test="${not empty requestScope.validacao.erros[identifier]}" var="withErrosOfValidation">
	<div class="row">
		<section class="col col-3" style="width: 600px;">
			<label class="input state-error" style="color: #555; font-weight: bolder; font-family: calibri; font-size: 15px;"><c:out value="${label}" /></label>
			<div class="input input-file state-error">
				<span class="button state-success "> <input id="${id}" type="file" size="30" name="${id}"  onchange="document.getElementById('file-falso').value = this.value;"
					class="valid">${label}
				</span> <input type="text" placeholder="${placeholder}" readonly="readonly" id="file-falso" name="file-falso" value="${value}" />
				<div class="row" style="margin-left: 2px; margin-top: 4px;">
					 <progress id="prog" value="0" max="100" style="width: 535px;"></progress>
					<a href="javascript:void(0);" class="btn btn-default btn-circle" id="upload${id}"><i class="fa fa-upload"></i></a>
				</div>
			</div>
		</section>
	</div>
</c:if>
<c:if test="${not withErrosOfValidation}">
	<div class="row">
		<section class="col col-3" style="width: 600px;">
			<label class="label" style="color: #555; font-weight: bolder; font-family: calibri; font-size: 15px;"><c:out value="${label}" /></label>
			<div class="input input-file state-success">
				<span class="button state-success "> <input id="${id}" type="file" size="30" name="${id}"  onchange="document.getElementById('file-falso').value = this.value;"
					class="valid">${label}
				</span> <input type="text" placeholder="${placeholder}" readonly="readonly" id="file-falso"  value="${value}" name="file-falso" />
				<div class="row" style="margin-left: 2px; margin-top: 4px;">
				 <progress id="prog" value="0" max="100" style="width: 535px;"></progress>
					<a href="javascript:void(0);" class="btn btn-default btn-circle" id="upload${id}"><i class="fa fa-upload"></i></a>
				</div>
			</div>
		</section>
	</div>
</c:if>
	<script>
		$("#upload${id}").on(
				"click",
				function() {
					$("#${id}").upload(
							'/gl/layoutArquivo/uploadFile?cid=' + '${cid}',
							function(sucesss) {
							}, function(prog, value) {
								$("#prog").val(value);
							});
				});
	</script>
